<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>web01</title>
    <link rel="stylesheet" href="/resources/layui/css/layui.css"/>
</head>
<body>
<div class="layui-row">
    <blockquote class="layui-elem-quote">
        <h1>员工列表</h1>
    </blockquote>
    <!--待审批列表-->
    <table id="demo" lay-filter="test"></table>
</div>

<script src="/resources/layui/layui.js"></script>
<script>
    var $ = layui.$;
    var layer = layui.layer;


    layui.use('table', function(){
        var table = layui.table;

        table.on('tool(test)', function (obj){
            console.log("obj=",obj);
            if (obj.event == 'del') {
                //删除
                layer.confirm("是否删除",{icon:3,title:"提示"},function (index){
                  $.getJSON("http://localhost/emp/del",{employeeId:obj.data.employeeId},function (d){
                      if (d.code!=0){
                          layer.msg(d.msg);
                      } else {
                          obj.del();//删除当前行dom
                          layer.close(index);//关闭弹出层
                      }
                  })
                })
            } else if (obj.event == 'edit') {
                //编辑
                layer.open({
                    type:2,
                    title:"添加员工",
                    content:"http://localhost/forward/edit",
                    area:['550px','400px'],
                    success:function (layero, index){
                        var body = layer.getChildFrame('body', index);
                        body.find("#empName").val(obj.data.name);
                        body.find("#title").val(obj.data.title);
                        body.find("#level").val(obj.data.level);
                        body.find("#employeeId").val(obj.data.employeeId);
                    },
                    end:function (){
                        table.reload("demo");
                    }

                })

            }
        })

        //第一个实例
        table.render({
            elem: '#demo'
            ,height: 450
            ,url: '/emp/list' //数据接口
            ,page : false
            ,cols: [[ //表头
                {field: 'employeeId', title: 'ID', sort: true}
                ,{field: 'name', title: '姓名',}
                ,{field: 'departmentName', title: '所属部门',  sort: true}
                ,{field: 'title', title: '职位', }
                ,{field: 'level', title: '职级',  sort: true,}
                ,{title: "操作",align:'center',templet:function (d){
                    var strRec = JSON.stringify(d);
                    var str = "<button type=\"button\" class=\"layui-btn layui-btn-sm layui-btn-normal \" lay-event='edit'>编辑</button>";
                    str+="<button type=\"button\" class=\"layui-btn layui-btn-sm layui-btn-danger \" lay-event='del'>删除</button>";
                    return str;
                    }
                },
            ]]
            ,
        });

    });
</script>
</body>
</html>